<template>
  <div class="fullheight">
    <ht-table
      ref="htTable"
      :data="rows"
      :pageResult="pagination"
      :selection="true"
      quick-search-props="xqmc"
      :show-export="false"
      :show-custom-column="false"
      @loading="loadData"
    >
      <template v-slot:toolbar>
        <el-button-group>
          <el-button size="small" @click="showDialog()" icon="el-icon-plus"
            >自动排课</el-button
          >
          <el-button
            v-popconfirm="{before: removeValid, confirm: handleRemove}"
            type="danger"
            icon="el-icon-delete"
            >删除</el-button
          >
        </el-button-group>
      </template>
      <template v-slot:search>
        <ht-table-search-panel
          :divide="3"
          :label-width="100"
          display-style="block"
        >
          <ht-table-search-field label="操作人" prop="czrxm" />
          <ht-table-search-field
            label="创建时间"
            prop="xjsj"
            type="daterange"
            operation="BETWEEN"
          />
        </ht-table-search-panel>
      </template>
      <template>
        <ht-table-column type="index" width="50" align="center" label="序号" fixed />
        <ht-table-column prop="pkjlid" width="180" label="编号" fixed />
        <ht-table-column
          prop="xqmc"
          label="学期"
          width="200"
          :show-overflow-tooltip="true"
          fixed
        >
          <template v-slot="{row}">
            <el-link
              type="primary"
              @click="showDialog(row.pkjlid)"
              title="查看详情"
              >{{ row.xqmc }}</el-link
            >
          </template>
        </ht-table-column>
        <ht-table-column
          prop="czrxm"
          label="操作人"
          :show-overflow-tooltip="true"
          fixed
        >
        </ht-table-column>
        <ht-table-column
          prop="pkzt"
          label="状态"
          width="120"
          :show-overflow-tooltip="true"
          fixed
          :filters="[
            {text: '未开始', value: '0'},
            {text: '进行中', value: '1'},
            {text: '已完成', value: '2'},
            {text: '已完成(部分完成)', value: '3'},
            {text: '异常', value: '4'}
          ]"
        >
          <template v-slot="{row}">
            <el-tag v-if="row.pkzt == '0'">未开始</el-tag>
            <el-tag v-if="row.pkzt == '1'">进行中</el-tag>
            <el-tag v-if="row.pkzt == '2'">已完成</el-tag>
            <el-tag v-if="row.pkzt == '3'">已完成(部分完成)</el-tag>
            <el-tag v-if="row.pkzt == '4'">异常</el-tag>
          </template>
        </ht-table-column>
        <ht-table-column
          prop="kbxrzt"
          label="排课表状态"
          width="120"
          :show-overflow-tooltip="true"
          fixed
          :filters="[
            {text: '已写入', value: '1'},
            {text: '未写入', value: '0'}
          ]"
        >
          <template v-slot="{row}">
            <el-tag type="success" v-if="row.kbxrzt == '1'">已写入</el-tag>
            <el-tag v-if="row.kbxrzt == '0'">未写入</el-tag>
          </template>
        </ht-table-column>
<!--        <ht-table-column
          prop="xjsj"
          label="创建时间"
          width="160"
          :sortable="true"
          :show-overflow-tooltip="true"
        >
        </ht-table-column>-->
        <ht-table-column
          prop="pkkssj"
          label="排课开始时间"
          width="160"
          :sortable="true"
          :show-overflow-tooltip="true"
          fixed
        >
        </ht-table-column>
        <ht-table-column
          prop="pkjssj"
          label="排课结束时间"
          width="160"
          :sortable="true"
          :show-overflow-tooltip="true"
          fixed
        >
        </ht-table-column>
        <ht-table-column
          prop="pkhs"
          label="排课耗时"
          :show-overflow-tooltip="true"
          fixed
        >
          <template v-slot="{row}">
            {{ changeTime(row.pkhs) }}
          </template>
        </ht-table-column>
        <ht-table-column
                prop="zrws"
                label="总任务书"
        >
        </ht-table-column>
        <ht-table-column
                prop="wprws"
                label="未排任务书"

        >
        </ht-table-column>
        <ht-table-column
                prop="pkksz"
                label="排课开始周"
        >
        </ht-table-column>
        <ht-table-column
                prop="pkjsz"
                label="排课结束周"
        >
        </ht-table-column>
        <ht-table-column
                prop="pklszs"
                label="排课老师总数"
        >
        </ht-table-column>
        <ht-table-column
                prop="ypklszs"
                label="已排课老师总数"
        >
        </ht-table-column>
        <ht-table-column
                prop="pkjszs"
                label="排课教室总数"
        >
        </ht-table-column>
        <ht-table-column
                prop="ypkjszs"
                label="已排课教室总数"
        >
        </ht-table-column>
        <ht-table-column
                prop="jhcs"
                label="进化次数"
        >
        </ht-table-column>
        <ht-table-column
          prop="pkdf"
          label="排课得分"
        >
        </ht-table-column>
        <ht-table-column width="150" label="操作" fixed="right">
          <template v-slot="{row}">
            <el-button
              type="text"
              @click="lookLog(row)"
              v-if="row.pkzt == '3' || row.pkzt == '4'"
              >查看日志</el-button
            >
            <el-button type="text" @click="deleteRow(row.pkjlid)"
              >删除</el-button
            >
          </template>
        </ht-table-column>
      </template>
    </ht-table>
    <!-- 新增和编辑 -->
    <record-manager-edit
      ref="recordManagerEdit"
      @updateTable="$refs.htTable.load()"
    ></record-manager-edit>
    <!-- 查看日志 -->
    <el-dialog
      title="异常信息"
      :visible.sync="logDiaShow"
      append-to-body
      class="log-dialog"
      :close-on-click-modal="false"
      width="1078px"
      custom-class="select-icon-dialog"
    >
      <ul>
        <li>
          <label>异常信息：</label>
          <span>{{ logData.ycxx }}</span>
        </li>
        <li>
          <label>异常堆栈：</label>
          <span>{{ logData.zjsz }}</span>
        </li>
      </ul>
    </el-dialog>
  </div>
</template>
<script>
import course from '@/api/course.js'
const recordManagerEdit = () =>
  import('@/views/course/record/RecordManagerEdit.vue')

export default {
  name: 'ruleManager',
  components: {recordManagerEdit},
  data() {
    return {
      logData: {
        ycxx: '',
        zjsz: ''
      },
      dialogVisible: false,
      rows: [],
      pagination: {
        page: 1,
        pageSize: 50,
        total: 0
      },
      rule: {},
      options: [
        {key: '1', value: '是'},
        {key: '0', value: '否'}
      ],
      groupList: [
        {key: 'default', value: '默认'},
        {key: 'teacher', value: '老师'}
      ],
      logDiaShow: false
    }
  },
  computed: {
    tableHeight() {
      return this.$baseTableHeight()
    }
  },
  methods: {
    changeTime(time) {
      let usedTime = time * 1000 // 相差的毫秒数
      let days = Math.floor(usedTime / (24 * 3600 * 1000)) // 计算出天数
      let leavel = usedTime % (24 * 3600 * 1000) // 计算天数后剩余的时间
      let hours = Math.floor(leavel / (3600 * 1000)) // 计算剩余的小时数
      let leavel2 = leavel % (3600 * 1000) // 计算剩余小时后剩余的毫秒数
      let minutes = Math.floor(leavel2 / (60 * 1000)) // 计算剩余的分钟数
      //计算秒数
      var seconds = Math.round((leavel2 % (60 * 1000)) / 1000)
      return `${days > 0 ? days + '天' : ''}${hours > 0 ? hours + '时' : ''}${
        minutes > 0 ? minutes + '分' : ''
      }${seconds}秒`
    },
    lookLog(row) {
      this.logDiaShow = true
      course.getErrorLog(row.pkjlid).then(res => {
        if (res.state) {
          if (res.value.zjsz) {
            res.value.zjsz = Base64.decode(res.value.zjsz)
          }
          this.logData = res.value
        }
      })
    },
    showDialog(id) {
      this.$refs.recordManagerEdit.showDialog(id)
    },
    loadData(param, cb) {
      course
        .getRecoredList(param || {})
        .then(resp => {
          let response = resp.data || resp
          this.rows = response.rows
          this.total = response.total
          this.pagination = {
            page: response.page,
            pageSize: response.pageSize,
            total: response.total
          }
        })
        .finally(() => cb && cb())
    },
    handleCommand(params) {
      switch (params.command) {
        case 'edit':
          this.$refs.ruleManagerEdit.showDialog(params.row.pkjlid)
          break
        default:
          break
      }
    },
    removeValid() {
      if (this.$refs.htTable.selection.length == 0) {
        this.$message({message: '请至少选择一条记录', type: 'warning'})
        return false
      }
      return true
    },
    handleRemove() {
      const ids = []
      this.$refs.htTable.selection.forEach(item => {
        ids.push(item.pkjlid)
      })
      course.removeLessonData(ids.join(',')).then(() => {
        this.$message.success('删除成功！')
        this.$refs.htTable.load()
      })
    },
    deleteRow(id) {
      this.$confirm('确认删除该条数据?', '提示信息', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        course.removeLessonData(id).then(() => {
          this.$message.success('删除成功！')
          this.$refs.htTable.load()
        })
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.log-dialog {
  ul {
    li {
      margin-bottom: 20px;
      font-size: 14px;
      display: flex;
      label {
        width: 80px;
      }
      span {
        flex: 1;
      }
    }
  }
}
</style>
